{include file="common/head"/}
<style>
  /*  .tipsinfo{
        margin: 0px -10px 10px 0px;
    }*/
    .tipsinfo p:hover{
       color: #FF0000;
    }
</style>
<!--<ul class="layui-nav" style="background: none;" id="shows">
    <li class="layui-nav-item">
        <dl class="layui-nav-child">
            <dd><a href="javascript:;">修改信息</a></dd>
            <dd><a href="javascript:;">安全管理</a></dd>
            <dd><a href="javascript:;">退了</a></dd>
        </dl>
    </li>
</ul>-->
<div class="layui-page-header headers">
    <div class="pagewrap">
        <span class="layui-breadcrumb">
          <a href="{:url('index/index')}">首页</a>
          <a href="javascript:;">{$authruleinfo.pid}</a>
          <a><cite>{$authruleinfo.id}</cite></a>
        </span>
        <a href="javascript:location.replace(location.href);" style="float:right" class="layui-btn layui-btn-blue refreshs"><i class="fa fa-history falocation" aria-hidden="true"></i>
        </a>
    </div>
</div>
<div class="layui-row layui-rows">
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="demoTable">
                <button  tipsmsg="删除" class="layui-btn layui-btns layui-btn-red onmousemovebtns" id="delAll"><i class="layui-icon">&#xe640;</i>删除</button>
            </div>
            <table class="layui-table" id="list" lay-filter="list"></table>
        </div>
    </div>
</div>
{include file="common/foot"/}
<script type="text/html" id="task_state">
    {{# if(d.task_state=='忙'){ }}
    <button class="layui-btn layui-btn-orange layui-btn-xs layui-btns">
        <i class="fa fa-circle-o-notch" aria-hidden="true"></i>&nbsp;忙
    </button>
    {{# }else{  }}
    <button class="layui-btn layui-btn-green layui-btn-xs layui-btns">
        <i class="fa fa-power-off" aria-hidden="true"></i>&nbsp;&nbsp;闲
    </button>
    {{# } }}
</script>
<script type="text/html" id="topBtn">
    <button class="layui-btn layui-btn layui-btn-blue layui-btn-sm" onclick="x_admin_show('添加分组','{:url('groupadd')}','500px','320px','95%','75%')"><i class="layui-icon"></i>添加</button>
</script>
<!--<script type="text/html" id="action" >
  <a tipsmsg="编辑" class="layuimsg" onclick="x_admin_show('编辑分组','{:url('groupedit')}?id={{d.id}}&name={{d.name}}&comment={{d.comment}}','500px','320px','95%','75%')">
        <button class="layui-btn layui-btn-blue layui-btn-xs layui-btns">
            <i class="layui-icon">&#xe642;</i>
        </button>
    </a>
    <a lay-event="del" tipsmsg="删除" class="layuimsg">
    <button class="layui-btn layui-btn-red layui-btn-xs layui-btns">
      <i class="layui-icon">&#xe640;</i>
    </button>
    </a>
</script>-->
<script type="text/html" id="action" >
    <a  ids="{{d.id}}"
        tipsedit="x_admin_show('编辑分组','{:url("groupedit")}?id={{d.id}}&name={{d.name}}&comment={{d.comment}}','500px','320px','95%','75%')"
       tipsupgrades="x_admin_show('要升级的软件网络URL','{:url("upgrades")}?id={{d.id}}','400px','200px','95%','200px')"
    class="layuimsg">
    <button class="layui-btn layui-btn-black layui-btn-xs layui-btns">
        <i class="fa fa-cog" aria-hidden="true"></i>&nbsp;<i class="layui-icon">&#xe625;</i>
    </button>
    </a>
</script>
<script>
    layui.use(['table','form','element'], function() {
        var table = layui.table,form = layui.form,element = layui.element, $ = layui.jquery;
        var tableIn = table.render({
            elem: '#list',
            url: '{:url("grouplist")}',
            text:{none: '<i class="fa fa-snowflake-o" aria-hidden="true"></i>&nbsp;暂无相关数据'},
            method: 'post',
            toolbar: '#topBtn',
            page: true,
            cols: [[
           /*     {checkbox:true,width: 80},*/
                {field: 'id', title: 'ID', width: 120,align: 'center',sort:true},
                {field: 'name', title: '分组名称',width:150,align: 'center'},
                {field: 'tji', title: '组内设备数量',width:150,align: 'center',sort:true},
                {field: 'comment', title: '备注',width:200},
    /*            {field:'task_state',title: '空闲状态',width:120, align: 'center', toolbar: '#task_state'},*/
                {field: 'time', title: '添加时间',align: 'center',width:170,sort:true},
                {width: 120,title: '操作', align: 'center', toolbar: '#action'}
            ]],
            limit: {$configinfo.limit}, //每页默认显示的数量
            limits:[{$configinfo.limit},100,200,400,600,1000,2000],
            done:function(msgs){
                /*onmousemoves();*/
                onmousemove();
               /* console.log(msgs.data);*/
            }
        });

        $(document).on('click','.layui-table-cell',function(){
            // $("p").css({"background-color":"blue","font-size":"14px"});
            var x=$(this).offset(),
                left=x.left,
                top=x.top;
            var w=$(this).width(),
                h=$(this).height();
            $('.hoverDiv').css({
                "width":w,
                "left":left+"px",
                "top":top+h+'px',
                "display":'block',
                "background":'pink',
            }).slideDown();
        })

        function onmousemove(){
            var tipsinfo = null;
            $('td .layuimsg').click(function(){
                layer.close(tipsinfo);
                var infos = $('.layui-layer-tips').css('display');
                /*alert(infos)*/
                var tipsedit = $(this).attr('tipsedit');
                var tipsupgrades = $(this).attr('tipsupgrades');
                var ids = $(this).attr('ids');
                var msg = tipsedit;
                var msg = '<div class="tipsinfo">'
                    +
                    '<p onclick='+tipsedit+'> <i class="layui-icon">&#xe642;</i>&nbsp;&nbsp;编辑</p>'
                    +'<p id="del" ids='+ids+'><i class="layui-icon">&#xe640;</i>&nbsp;&nbsp;删除</p>'
                    +'<p ids='+ids+' id="restart"><i class="fa fa-circle-o-notch" aria-hidden="true" style="text-indent: 2px;"></i>&nbsp;&nbsp;设备重启</p>'
                    +'<p ids='+ids+' id="cleanemptys"><i class="fa fa-grav" aria-hidden="true" style="text-indent: 2px;"></i>&nbsp;&nbsp;任务清空</p>'
                    +'<p onclick='+tipsupgrades+'><i class="fa fa-sort-amount-asc" aria-hidden="true" style="text-indent: 2px;"></i>&nbsp;&nbsp;软件升级</p>'
                    +'<p><i class="fa fa-eye" aria-hidden="true" style="text-indent: 2px;"></i></i>&nbsp;&nbsp;查看设备</p>'
                    + '</div>';

                /* var msg = "<p "+tipsedit+">编辑</p>"*/
                if(infos=='block'){
                    layer.close(tipsinfo);
                }else{
                    tipsinfo = layer.tips(msg, this,{
                        tips: 3, //还可配置颜色
                        time: 60000000
                    });
                }
                $('#del').click(function(){
                    var ids = $(this).attr('ids');
                    alert(ids);
                })

                //设备重启
                $("#restart").click(function(){
                    var id = $(this).attr('ids');
                    var url = "{:url('restarts')}";
                    pushtask(id,url);
                })

                //任务清空
                $("#cleanemptys").click(function(){
                    var id = $(this).attr('ids');
                    var url = "{:url('cleanemptys')}";
                    pushtask(id,url);
                })

                function pushtask(id,url){
                    var loading = layer.load(1, {shade: [0.1, '#fff']});
                    $.post(url, {id: id}, function (data) {
                        layer.close(loading);
                        if (data.code === 1) {
                            layer.msg(data.msg);
                            tableIn.reload();
                        }else if(data.code === 0) {
                            layer.msg(data.msg);
                        }else{
                            layer.msg('你无操作权限！');
                        }
                    },'json');
                }

            })
        }

        table.on('tool(list)', function(obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('您确定要删除该信息吗？', {icon: 3,skin: 'layui-layer-lan',anim: 4,title:'删除'}, function(index){
                    var loading = layer.load(1, {shade: [0.1, '#fff']});
                    $.post("{:url('devicedel')}",{id:data.id},function(res){
                        layer.close(loading);
                        if(res.code===1){
                            layer.msg(res.msg);
                            tableIn.reload();
                        }else if(res.code === 0) {
                            layer.msg(res.msg);
                        }else{
                            layer.msg('你无操作权限！');
                        }
                    },'json');
                    layer.close(index);
                });
            }
        });

        $('#delAll').click(function(){
            var checkStatus = table.checkStatus('list'); //test即为参数uid设定的值
            var id = [];
            $(checkStatus.data).each(function (i, o) {
                id.push(o.id);
            });
            if (id == ""){
                layer.msg("请选择内容进行删除");
                return false;
            }
            layer.confirm('确认要删除选中信息吗？', {icon: 3,skin: 'layui-layer-lan',anim: 4,title:'删除'}, function(index) {
                layer.close(index);
                var loading = layer.load(1, {shade: [0.1, '#fff']});
                id = id.toString();
                $.post("{:url('devicedel')}", {id: id}, function (data) {
                    layer.close(loading);
                    if (data.code === 1) {
                        layer.msg(data.msg);
                        tableIn.reload();
                    }else if(data.code === 0) {
                        layer.msg(data.msg);
                    }else{
                        layer.msg('你无操作权限！');
                    }
                },'json');
            });
        })
    });
</script>
